<template>
  <el-row>
    <el-col :span="11">
      <el-breadcrumb separator="/" style="margin: 0 0 20px 0">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>标的物</el-breadcrumb-item>
      </el-breadcrumb>
      <el-input placeholder="请输入ID" size="small" style="width: 40%" v-model.trim="sousuo"></el-input>
      <el-button type="primary" size="small" @click="searchid()">搜索</el-button>
    </el-col>
    <el-col :span="11">
      <h1>标的物</h1>
    </el-col>
    <el-col :span="2">
      <el-button type="primary" size="small" @click="dialogFormAdd = true">添加标的物</el-button>
    </el-col>
    <el-col :span="24" style="margin:  10px 0 3% 0">
      <el-table
        :data="dbwData"
        style="width: 100%;">
        <el-table-column
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column
          prop="number"
          label="房屋编号">
        </el-table-column>
        <el-table-column
          prop="description"
          label="标的物">
        </el-table-column>
        <el-table-column
          prop="coordinate"
          label="坐标">
        </el-table-column>
        <el-table-column
          prop="price"
          label="底价">
        </el-table-column>
        <el-table-column
          prop="status"
          label="状态"
          sortable>
        </el-table-column>
        <el-table-column
          fixed="right"
          label="操作"
          width="180">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="lookstMatter(scope.$index, scope.row)">查看</el-button>
            <el-button type="text" size="small" @click="upstMatter(scope.$index, scope.row)">编辑</el-button>
            <el-button type="text" size="small" @click="delstMatter(scope.$index, scope.row)">删除</el-button>
            <el-button type="text" size="small" @click="jindu(scope.row)">进度</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-col>
    <el-col :span="24" style="text-align: center">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[5,10]"
        :page-size="5"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
      <el-dialog title="添加标的物" :visible.sync="dialogFormAdd">
        <el-form :model="formAdd" style="width:  80%" :rules="rules1" ref="formAdd">
          <el-form-item label="标的物描述 :" label-width="20%" prop="description">
            <el-input v-model="formAdd.description"></el-input>
          </el-form-item>
          <el-form-item label="底价(万) :" label-width="20%" prop="price">
            <el-input v-model="formAdd.price"></el-input>
          </el-form-item>
          <el-form-item label="报名人数 :" label-width="20%" prop="enrolment">
            <el-input v-model="formAdd.enrolment"></el-input>
          </el-form-item>
          <el-form-item label="标签 :" label-width="20%" prop="label">
            <el-input v-model="formAdd.label" placeholder="如果有多个标签请用逗号分隔!"></el-input>
          </el-form-item>
          <el-form-item label="规格 :" label-width="20%" prop="standard">
            <el-input v-model="formAdd.standard" placeholder="如三室两厅,150平方米"></el-input>
          </el-form-item>
          <el-form-item label="坐标 :" label-width="20%" prop="coordinate">
            <el-input v-model="formAdd.coordinate" placeholder="填写标的物地址即可"></el-input>
          </el-form-item>
          <el-form-item label="热度 :" label-width="20%" prop="sort">
            <el-input v-model="formAdd.sort" placeholder="1为1个火,2为2个,3为3个,最多为3"></el-input>
          </el-form-item>
          <el-form-item label="开标人数 :" label-width="20%" prop="purchaser">
            <el-input v-model="formAdd.purchaser"></el-input>
          </el-form-item>
          <el-form-item label="状态:" label-width="20%" prop="status">
            <el-input v-model="formAdd.status" placeholder="0为挂牌中,1竞拍中,2已竞出,3为未竞出,4为已下架"></el-input>
          </el-form-item>
          <el-form-item label="进度 :" label-width="20%" prop="state">
            <el-input v-model="formAdd.state" placeholder="进度默认为0,0为挂牌,1为竞拍中,2已竞出,3为未竞出,4为已下架"></el-input>
          </el-form-item>
          <el-form-item label="选择专家 :" label-width="20%" prop="customerManagerId">
          <el-select v-model="value" clearable placeholder="请选择" style="width: 100%" @change="changeValue">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
          <el-form-item label="照片上传 :" label-width="20%">
            <el-upload
              action="https://xcx.wzlzfc.com/bbdj/house/uploadimage"
              list-type="picture-card"
              :limit="5"
              ref="upload"
              :on-exceed="handleExcee"
              :on-preview="handlePictureCardPreview"
              :on-success="handlechange"
              :on-remove="handleRemove"
              :before-upload="beforeAvatarUpload">
              <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible" size="tiny">
              <img width="100%" :src="dialogImageUrl" alt="">
            </el-dialog>
          </el-form-item>
          <el-form-item label="视频上传 :" label-width="20%">
            <el-upload
              class="upload-demo"
              ref="upload1"
              action="https://www.embracex.com/gcsweixin/house/uploadvideo"
              :on-success="handlePreview3"
              :on-remove="handleRemove3"
              :before-remove="beforeRemove3"
              :on-exceed="handleExceed3"
              :before-upload="beforeAvatarUpload3"
              multiple
              :limit="1">
              <el-button size="small" type="primary">点击上传</el-button>
              <div slot="tip" class="el-upload__tip">只能上传MP4文件，且不超过200MB</div>
            </el-upload>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="resetForm('formAdd')">取 消</el-button>
          <el-button type="primary" @click="addstMatter('formAdd')">确 定</el-button>
        </div>
      </el-dialog>
      <el-dialog title="查看标的物" :visible.sync.sync="dialogFormLook">
        <el-form :model="formLook" style="width:  80%">
          <el-form-item label="标的物描述 :" label-width="20%">
            <el-input v-model="formLook.description"></el-input>
          </el-form-item>
          <el-form-item label="底价(万):" label-width="20%">
            <el-input v-model="formLook.price"></el-input>
          </el-form-item>
          <el-form-item label="报名人数 :" label-width="20%">
            <el-input v-model="formLook.enrolment"></el-input>
          </el-form-item>
          <el-form-item label="标签 :" label-width="20%">
            <el-input v-model="formLook.label" placeholder="如果有多个标签请用逗号分隔!"></el-input>
          </el-form-item>
          <el-form-item label="规格 :" label-width="20%">
            <el-input v-model="formLook.standard" placeholder="如三室两厅,150平方米"></el-input>
          </el-form-item>
          <el-form-item label="坐标 :" label-width="20%">
            <el-input v-model="formLook.coordinate" placeholder="填写标的物地址即可"></el-input>
          </el-form-item>
          <el-form-item label="热度 :" label-width="20%">
            <el-input v-model="formLook.sort" placeholder="1为1个火,2为2个,3为3个,最多为3"></el-input>
          </el-form-item>
          <el-form-item label="开标人数 :" label-width="20%">
            <el-input v-model="formLook.purchaser"></el-input>
          </el-form-item>
          <el-form-item label="状态:" label-width="20%">
            <el-input v-model="formLook.status" placeholder="0为挂牌中,1竞拍中,2已竞出,3为未竞出,4为已下架"></el-input>
          </el-form-item>
          <el-form-item label="进度:" label-width="20%">
            <el-input v-model="formLook.state" placeholder="进度默认为0,0为挂牌,1为竞拍中,2已竞出,3为未竞出,4为已下架"></el-input>
          </el-form-item>
          <el-form-item label="选择专家 :" label-width="20%" prop="customerManagerId">
            <el-select v-model="value1" clearable placeholder="请选择" style="width: 100%" >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="照片上传 :" label-width="20%">
            <el-upload
              action="https://xcx.wzlzfc.com/bbdj/house/uploadimage"
              list-type="picture-card"
              :file-list="img1"
              :limit="5"
              :on-exceed="handleExcee"
              :on-preview="handlePictureCardPreview1"
              :on-success="handlechange1"
              :on-remove="handleRemove1"
              :before-upload="beforeAvatarUpload">
              <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible1" size="tiny">
              <img width="100%" :src="dialogImageUrl1" alt="">
            </el-dialog>
          </el-form-item>
          <el-form-item label="视频上传 :" label-width="20%">
            <el-upload
              class="upload-demo"
              ref="upload"
              action="https://www.embracex.com/gcsweixin/house/uploadvideo"
              :before-remove="beforeRemove3"
              :on-exceed="handleExceed3"
              :before-upload="beforeAvatarUpload3"
              multiple
              :limit="1"
              :file-list="fileList">
              <el-button size="small" type="primary">点击上传</el-button>
              <div slot="tip" class="el-upload__tip">只能上传MP4文件，且不超过200MB</div>
            </el-upload>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="cs()">添加标的物详情</el-button>
          <el-button type="primary" @click="dialogFormAt = true">添加经纪人评论</el-button>
          <el-button @click="dialogFormLook = false">取 消</el-button>
          <el-button type="primary" @click="dialogFormLook = false">确 定</el-button>
        </div>
      </el-dialog>
      <el-dialog title="修改标的物" :visible.sync.sync="dialogFormUp">
        <el-form :model="formUp" style="width:  80%" :rules="rules1" ref="formUp">
          <el-form-item label="标的物描述 :" label-width="20%" prop="description">
            <el-input v-model="formUp.description"></el-input>
          </el-form-item>
          <el-form-item label="底价(万) :" label-width="20%" prop="price">
            <el-input v-model="formUp.price"></el-input>
          </el-form-item>
          <el-form-item label="报名人数 :" label-width="20%" prop="enrolment">
            <el-input v-model="formUp.enrolment"></el-input>
          </el-form-item>
          <el-form-item label="标签 :" label-width="20%" prop="label">
            <el-input v-model="formUp.label" placeholder="如果有多个标签请用逗号分隔!"></el-input>
          </el-form-item>
          <el-form-item label="规格 :" label-width="20%" prop="standard">
            <el-input v-model="formUp.standard" placeholder="如三室两厅,150平方米"></el-input>
          </el-form-item>
          <el-form-item label="坐标 :" label-width="20%" prop="coordinate">
            <el-input v-model="formUp.coordinate" placeholder="填写标的物地址即可"></el-input>
          </el-form-item>
          <el-form-item label="热度 :" label-width="20%" prop="sort">
            <el-input v-model="formUp.sort" placeholder="1为1个火,2为2个,3为3个,最多为3"></el-input>
          </el-form-item>
          <el-form-item label="开标人数 :" label-width="20%" prop="purchaser">
            <el-input v-model="formUp.purchaser"></el-input>
          </el-form-item>
          <el-form-item label="状态:" label-width="20%" prop="status">
            <el-input v-model="formUp.status" placeholder="0为挂牌中,1竞拍中,2已竞出,3为未竞出,4为已下架"></el-input>
          </el-form-item>
          <el-form-item label="进度 :" label-width="20%" prop="state">
            <el-input v-model="formUp.state" placeholder="进度默认为0,0为挂牌,1为竞拍中,2已竞出,3为未竞出,4为已下架"></el-input>
          </el-form-item>
          <el-form-item label="选择专家 :" label-width="20%" prop="customerManagerId">
            <el-select v-model="value2" clearable placeholder="请选择" style="width: 100%" @change="changeValue1">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="照片上传 :" label-width="20%">
            <el-upload
              action="https://xcx.wzlzfc.com/bbdj/house/uploadimage"
              list-type="picture-card"
              :file-list="img22"
              :limit="5"
              ref="upload2"
              :on-exceed="handleExcee"
              :on-preview="handlePictureCardPreview2"
              :on-success="handlechange2"
              :on-remove="handleRemove2"
              :before-upload="beforeAvatarUpload">
              <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible2" size="tiny">
              <img width="100%" :src="dialogImageUrl2" alt="">
            </el-dialog>
          </el-form-item>
          <el-form-item label="视频上传 :" label-width="20%">
            <el-upload
              class="upload-demo"
              ref="upload3"
              action="https://www.embracex.com/gcsweixin/house/uploadvideo"
              :on-success="handlePreview4"
              :on-remove="handleRemove4"
              :before-remove="beforeRemove3"
              :on-exceed="handleExceed3"
              :before-upload="beforeAvatarUpload3"
              multiple
              :limit="1"
              :file-list="fileList1">
              <el-button size="small" type="primary">点击上传</el-button>
              <div slot="tip" class="el-upload__tip">只能上传MP4文件，且不超过200MB</div>
            </el-upload>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="resetForm2('formUp')">取 消</el-button>
          <el-button type="primary" @click="upstMatter1('formUp')">确 定</el-button>
        </div>
      </el-dialog>
      <el-dialog title="添加经纪人评论" :visible.sync.sync="dialogFormAt">
        <el-form :model="formAt" style="width:  80%" :rules="rules2" ref="formAt">
          <el-form-item label="选择经纪人 :" label-width="20%" prop="opid">
            <el-select v-model="value3" clearable placeholder="请选择" style="width: 100%" @change="changeValue2">
              <el-option
                v-for="item in options1"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="评论内容 :" label-width="20%" prop="content">
            <el-input type="textarea" :autosize="{ minRows: 5, maxRows: 10}" v-model="formAt.content" placeholder="请输入留言"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="resetForm1('formAt')">取 消</el-button>
          <el-button type="primary" @click="addatcomment('formAt')">确 定</el-button>
        </div>
      </el-dialog>
      <el-dialog title="添加标的物详情" :visible.sync.sync="dialogFormXq">
        <el-form style="width:  80%">
          <el-form-item label="标的物详情 :" label-width="20%">
            <el-input
              type="textarea"
              :autosize="{ minRows: 15, maxRows: 20}"
              v-model="formXq"
              placeholder="填写json格式的数据">
            </el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormXq = false">取 消</el-button>
          <el-button type="primary" @click="addxq()">确 定</el-button>
        </div>

      </el-dialog>

    </el-col>
  </el-row>
</template>

<script>
  import {
    addMatter,
    getMatter,
    delMatter,
    upMatter,
    getMatterid,
    addcomment,
    adddetails,
    cs,
    ckjd,
    smqueryid
  } from "@/api/matterApi";
  import {getetlist,getexpertid} from "@/api/expertApi";
  import {getAgent,getAgentid} from "@/api/agentApi";

  export default {
    data() {
      let price = (rule, value, callback) => {
        if (/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/.test(value) === false) {
          callback(new Error('必须是正数'));
        } else {
          callback();
        }
      };
      let price1 = (rule, value, callback) => {
        if (/^[0-9]\d*$/.test(value) === false) {
          callback(new Error('必须是正整数'));
        } else {
          callback();
        }
      };
      let hot = (rule, value, callback) => {
        if (/^[0-9]\d*$/.test(value) === false) {
          callback(new Error('必须是正整数'));
        }else if(value>3000){
          callback(new Error('不能大于3000'));
        } else {
          callback();
        }
      };
      let status1 = (rule, value, callback) => {
        if (/^[0-9]\d*$/.test(value) === false) {
          callback(new Error('必须是正整数'));
        }else if(value>4){
          callback(new Error('不能大于4'));
        } else {
          callback();
        }
      };
      let level1= (rule, value, callback) => {
        if (/^[0-9]\d*$/.test(value) === false) {
          callback(new Error('必须是正整数'));
        }else if(value>6){
          callback(new Error('不能大于6'));
        } else {
          callback();
        }
      };

      return {
        dialogFormAdd: false,
        dialogFormUp: false,
        dialogFormLook: false,
        dialogFormAt: false,
        dialogFormXq: false,
        currentPage1: 1,
        total: 10,
        size: 5,
        page: 1,
        stid: '',
        value: '',
        value1: '',
        value2: '',
        value3:'',
        sousuo: '',
        img: [],
        img1: [],
        img2: [],
        img22: [],
        options: [],
        options1:[],
        opvalue:[],
        fileList: [],
        fileList1: [],
        dialogImageUrl: '',
        dialogImageUrl1: '',
        dialogImageUrl2: '',
        dialogVisible: false,
        dialogVisible1: false,
        dialogVisible2: false,
        formAt: {
          name: '',
          headImg: '',
          content: '',
          level: '',
          opid:'',
          ascriptionId: '',
        },
        formAdd: {
          images: "",
          description: "",
          enrolment: "",
          label: "",
          status: "",
          standard: "",
          coordinate: "",
          sort: "",
          price: "",
          purchaser: "",
          state: "",
          customerManagerId: "",
          video:"",
        },
        formLook: {
          images: "",
          description: "",
          enrolment: "",
          label: "",
          status: "",
          standard: "",
          coordinate: "",
          sort: "",
          price: "",
          purchaser: "",
          state: "",
          video:"",
        },
        formUp: {
          images: "",
          description: "",
          enrolment: "",
          label: "",
          status: "",
          standard: "",
          coordinate: "",
          sort: "",
          price: "",
          purchaser: "",
          state: "",
          video:"",
        },
        formXq: '',
        dbwData: [],
        rules1: {
          description: [
            {required: true, message: '请输入标的物描述', trigger: 'blur'},
          ],
          price: [
            {required: true, message: '请输入底价', trigger: 'blur'},
            {validator: price, trigger: 'blur'},
          ],
          enrolment: [
            {required: true, message: '请输入报名人数', trigger: 'blur'},
            {validator: price1, trigger: 'blur'},
          ],
          label: [
            {required: true, message: '请输入标签', trigger: 'blur'},
          ],
          standard: [
            {required: true, message: '请输入规格', trigger: 'blur'},
          ],
          coordinate: [
            {required: true, message: '请输入坐标', trigger: 'blur'},
          ],
          sort: [
            {required: true, message: '请输入热度', trigger: 'blur'},
            {validator: hot, trigger: 'blur'},
          ],
          purchaser: [
            {required: true, message: '请输入开标人数', trigger: 'blur'},
            {validator: price1, trigger: 'blur'},
          ],
          status: [
            {required: true, message: '请输入状态', trigger: 'blur'},
            {validator: status1, trigger: 'blur'},
          ],
          state: [
            {required: true, message: '请输入进度', trigger: 'blur'},
            {validator: status1, trigger: 'blur'},
          ],
          customerManagerId: [
            {required: true, message: '请选择专家', trigger: 'change'},
          ],
        },
        rules2: {
          content:[
            {required: true, message: '请输入内容', trigger: 'blur'},
          ],
          opid:[
            {required: true, message: '请选择经纪人', trigger: 'change'},
          ]
        },
      }
    },
    methods: {
      cs() {
        this.formXq = '';
        let data = {commodityid: this.stid};
        cs(data).then((res) => {
          if (res.data.data !== null) {
            let a = JSON.parse(res.data.data);
            let c = JSON.parse(a.detail);
            let b = JSON.stringify(c, null, "\t");
            this.formXq = b;
          } else if (res.data.data === null) {
            this.formXq = '[\n' +
              '    {\n' +
              '        "房产编号": "没有详情请添加",\n' +
              '        "建筑面积": "xx平方米",\n' +
              '        "房屋地址": "龙江路与瓯海大道交叉路口",\n' +
              '        "房屋户型": "三室两厅两卫",\n' +
              '        "房屋用途": "住宅",\n' +
              '        "装修状态": "精装修",\n' +
              '        "房屋楼层": "1/20",\n' +
              '        "房龄": "2年",\n' +
              '        "朝向": "朝南",\n' +
              '        "车位": "有",\n' +
              '        "物业费": "3.8元/每平方"\n' +
              '    },\n' +
              '    {\n' +
              '        "交通": "48路、49路",\n' +
              '        "学区": "龙湾十幼，龙湾第一实验小学，龙湾实验中学",\n' +
              '        "医疗": "龙湾第一人民医院",\n' +
              '        "商业": "万达广场",\n' +
              '        "配套": "游泳池,健身房"\n' +
              '    },\n' +
              '    {\n' +
              '        "建议参拍价格区间": "190~210万",\n' +
              '        "小区目前市场均价": "155.88万",\n' +
              '        "小区附近新楼均价": "100.88万",\n' +
              '    },\n' +
              '    \n' +
              '      {  "小区历史竞价成交记录": {\n' +
              '          \n' +
              '              "中宝贝小区50":"380万",\n' +
              '              "小宝贝小区58":"200万"\n' +
              '        }\n' +
              '},\n' +
              '     {\n' +
              '             "走势": {\n' +
              '             月份:[ \'1月\',\'2月\',\'3月\',\'4月\',\'5月\',\'6月\',\'7月\',\'8月\',\'9月\',\'10月\',\'11月\',\'12\'],\n' +
              '             价格:[ 2.422745,2.298267,2.681612,2.703762,2.572184,2.501295,2.992122,' + '2.485552,2.133416,2.869653,2.719034,2.435632]\n' +
              '\t}\n' +
              '      },\n' +
              '    {\n' +
              '        "竞价低价": "190万",\n' +
              '        "参考价": "190万~210万",\n' +
              '        "竞价次数": "1",\n' +
              '        "竞价保证金": "10万",\n' +
              '        "一次性加价幅度": "2万"\n' +
              '    },\n' +
              '    {\n' +
              '        "规定付款方式": "可以一次性，可以按揭",\n' +
              '        "竞价人数": "4"\n' +
              '    },\n' +
              '    {\n' +
              '        "看房时间": [\n' +
              '                "周一至周五，中午11：30——1：30",\n' +
              '                "周六周日全天可以看"\n' +
              '        ]\n' +
              '\n' +
              '    },\n' +
              '\t{"报名时间": "2018年1月15日 16:47:49~19:00:00","竞价时间": "2018年1月20日 16:48:14"},\n' +
              '    {\n' +
              '        "卖方经纪人": "向超",\n' +
              '        "手机": "18357800048"\n' +
              '    }\n' +
              ']\n'
          }
        })
        this.dialogFormXq = true
      },
      getstMatter() {
        let data = {
          page: this.page,
          size: this.size
        };
        this.options = [];
        this.dbwData = [];
        getMatter(data).then((res) => {
          res.data.data.content.forEach((value)=>{
            switch (value.status){
              case  0:
                value.status='挂牌中';
                break;
              case  1:
                value.status='竞拍中';
                break;
              case  2:
                value.status='已竞出';
                break;
              case  3:
                value.status='未竞出';
                break;
              case 4:
                value.status='已下架';
                break;
            }
          });
          if (this.sousuo !== '') {
            let data = {number: this.sousuo};
            smqueryid(data).then((res) => {
              if (res.data.data != null) {
                let a = res.data.data;
                this.dbwData.push(a);
              }
            })
          } else {
            this.dbwData = res.data.data.content;
          }
          this.total = res.data.data.totalElements;
        });
        getetlist().then((ress) => {
          ress.data.data.forEach((value) => {
            this.options.push({label: value.name, value: value.id});
          })
        });
        getAgent().then((resss)=>{
          resss.data.data.forEach((value)=>{
             this.options1.push({label:value.name,value:value.id});
          })
        });
      },
      changeValue(value) {
        this.formAdd.customerManagerId = value;
      },
      changeValue1(value) {
        this.formUp.customerManagerId = value;
      },
      changeValue2(value) {
        this.formAt.opid = value;
      },
      addstMatter(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.formAdd.images = this.img.toString();
            let data = this.formAdd;
            addMatter(data).then((res) => {
              this.getstMatter();
              this.resetForm(formName);
            })
          } else {
            this.$message({
              message: '请填写完整!',
              type: 'warning'
            });
            return false;
          }
        });
      },
      delstMatter(index, row) {
        let data = {commodityid: row.id};
        this.$confirm('确认删除吗?', '提示', {
          type: 'warning'
        }).then(() => {
          delMatter(data).then((res) => {
            this.getstMatter();
            this.$message({
              message: '删除标的物成功!',
              type: 'success'
            });
          })
        }).catch(() => {
        });

      },
      lookstMatter(index, row) {
        this.value1='';
        this.img1=[];
        this.fileList=[];
        this.stid = row.id;
        let data = {commodityid: row.id};
        getMatterid(data).then((res) => {
          this.formLook = res.data.data;
          if (this.formLook.images !== '') {
            this.img1 = this.tpjq(this.formLook.images);
          }
          if(res.data.data.video!=null&&res.data.data.video!=''){
            this.fileList=[{name:res.data.data.video,url:'1'}];
          }
          let data= {customermanagerid:res.data.data.customerManagerId};
          getexpertid(data).then((ress) => {
              let a=ress.data.data;
              this.value1=a.name;
          })
        });
        this.dialogFormLook = true;
      },


      upstMatter(index, row) {
        this.value2='';
        this.fileList1=[];
        this.stid = row.id;
        let data = {commodityid: row.id};
        getMatterid(data).then((res) => {
          this.formUp = res.data.data;
          if (this.formUp.images !== '') {
            this.img22 = this.tpjq(this.formUp.images);
            let img = this.formUp.images;
            let imgjq = img.substring(0, img.length);
            let imgs = imgjq.split(',');
            this.img2 = imgs;
          }
          if(res.data.data.video!=null&&res.data.data.video!=''){
            this.fileList1=[{name:res.data.data.video,url:'1'}];
          }
          let data= {customermanagerid:res.data.data.customerManagerId};
          getexpertid(data).then((ress) => {
            let a=ress.data.data;
            this.value2=a.name;
          });
          this.dialogFormUp = true;
        })

      },
      upstMatter1(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            if(this.img2!==''){
              this.formUp.images = this.img2.toString();
            }else{
              this.formUp.images="";
            }
            let id = {commodityid: this.stid};
            let data = this.formUp;
            upMatter(id, data).then((res) => {
              this.getstMatter();
              this.resetForm2(formName);
              this.$message({
                message: '修改标的物成功!',
                type: 'success'
              });
            })
          } else {
            this.$message({
              message: '请填写完整!',
              type: 'warning'
            });
            return false;
          }
        });
      },
      addatcomment(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            let data={agentid:this.formAt.opid};
            getAgentid(data).then((re)=>{
              this.opvalue=re.data.data;
              if(re.data.data!=null){
                this.formAt.name=this.opvalue.name;
                this.formAt.level=this.opvalue.level;
                this.formAt.headImg=this.opvalue.headImg;
                this.formAt.ascriptionId = this.stid;
                let data1 = this.formAt;
                addcomment(data1).then((res) => {
                  this.resetForm1(formName);
                  this.$message({
                    message: '添加评论成功!',
                    type: 'success'
                  });
                })
              }
            });

          } else {
            this.$message({
              message: '请填写完整!',
              type: 'warning'
            });
            return false;
          }
        });
      },
      addxq() {
        let qaq = (eval(this.formXq));
        let q3q = JSON.stringify(qaq);
        let id = {commodityid: this.stid};
        let data = {detail: q3q};
        adddetails(id, data).then((res) => {
          this.dialogFormXq = false;
          this.$message({
            message: '添加标的物详情成功!',
            type: 'success'
          });
        })
      },

      tpjq(qaq) {
        let img = qaq;
        let imgjq = img.substring(0, img.length);
        let imgs = imgjq.split(',');
        let geshi = [];
        for (let i = 0; i < imgs.length; i++) {
          let qa = imgs[i];
          let qaa = qa.split('.');
          geshi.push(qaa[qaa.length - 1]);
        }
        let images = [];
        for (let i = 0; i < imgs.length; i++) {
          images.push({name: i + 1 + '.' + geshi[i], url: imgs[i]})
        }
        return images;
      },

      handleSizeChange(val) {
        this.size = val;
        this.getstMatter();
      },
      handleCurrentChange(val) {
        this.page = val;
        this.getstMatter();
      },
      jindu(row) {
        let data = {commodityid: row.id};
        ckjd(data).then((res) => {
          if (res.data.data != '') {
            let a=row.id;
            this.$router.push({name: 'schedule', query:{id: a}});
          }
          else {
            this.$message({
              message: '标的物还没有进程',
              type: 'warning'
            });
          }
        })
      },
      searchid() {
        this.getstMatter()
      },
      beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg';
        const isLt2M = file.size / 1024 / 1024 < 2;

        if (!isJPG) {
          this.$message.error('上传头像图片只能是 JPG 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传头像图片大小不能超过 2MB!');
        }
        return isJPG && isLt2M;
      },
      handleExcee(files, fileList) {
        this.$message.warning(`当前限制选择 5 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
      },
      handlechange(file) {
        this.img.push(file.data);
      },
      handleRemove(file, fileList) {
        Array.prototype.remove = function (val) {
          let index = this.indexOf(val);
          if (index > -1) {
            this.splice(index, 1);
          }
        };
        this.img.remove(file.response.data)
      },
      handlePictureCardPreview(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      handlechange1(file) {
        this.img1.push(file.data);
      },
      handleRemove1(file, fileList) {
        Array.prototype.remove = function (val) {
          let index = this.indexOf(val);
          if (index > -1) {
            this.splice(index, 1);
          }
        };
        this.img1.remove(file.response.data);
      },
      handlePictureCardPreview1(file) {
        this.dialogImageUrl1 = file.url;
        this.dialogVisible1 = true;
      },
      handlechange2(file) {
        this.img2.push(file.data);
      },
      handleRemove2(file, fileList) {
        Array.prototype.remove = function (val) {
          let index = this.indexOf(val);
          if (index > -1) {
            this.splice(index, 1);
          }
        };
        if (file.response === undefined && file.url !== '') {
          this.img2.remove(file.url);
        } else {
          this.img2.remove(file.response.data);
        }
      },
      handlePictureCardPreview2(file) {
        this.dialogImageUrl2 = file.url;
        this.dialogVisible2 = true;
      },
      handleRemove3(file, fileList) {
        this.formAdd.video='';
      },
      handlePreview3(response) {
        this.formAdd.video=response.data;
      },
      handleExceed3(files, fileList) {
        this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
      },
      beforeRemove3(file, fileList) {
        return this.$confirm(`确定移除 ${ file.name }？`);
      },
      beforeAvatarUpload3(file) {
        const isJPG = file.type === 'video/mp4';
        const isLt2M = file.size / 1024 / 1024 < 200;
        if (!isJPG) {
          this.$message.error('上传只能是 MP4 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传大小不能超过 200MB!');
        }
        return isJPG && isLt2M;
      },
      handleRemove4(file, fileList) {
        this.formUp.video='';
      },
      handlePreview4(response) {
        this.formUp.video=response.data;
      },
      resetForm(formName) {
        this.dialogFormAdd = false;
        this.$refs.upload.clearFiles();
        this.$refs.upload1.clearFiles();
        this.value='';
        this.$refs[formName].resetFields();
      },
      resetForm1(formName) {
        this.dialogFormAt = false;
        this.formAt.headImg='';
        this.value3='';
        this.$refs[formName].resetFields();
      },
      resetForm2(formName) {
        this.dialogFormUp = false;
        this.$refs.upload2.clearFiles();
        this.$refs.upload3.clearFiles();
        this.value='';
        this.$refs[formName].resetFields();
      },
    },
    mounted() {
      this.getstMatter();
    },
  }
</script>

<style>

  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }

  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }

  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;

    text-align: center;
  }

  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }

</style>
